import { createVNode, render } from "vue";
import toastTemplate from "./index.vue";
const defaultOpt = {
    // 创建默认参数
    duration: 1500,
};

// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
const Toast = (options) => {
    const container = document.createElement("div");
    const opt = { ...defaultOpt, ...options };
    const vm = createVNode(toastTemplate, opt); // 创建vNode
    render(vm, container);
    document.body.appendChild(container); // 添加到body上
    const destory = () => {
        const dom = vm.el;
        if (dom.querySelector(".toast-value")) {
            dom.querySelector(".toast-value")?.classList.add("remove"); // 销毁时添加淡入淡出效果
            const t = setTimeout(() => {
                // 淡入淡出效果之后删除dom节点
                render(null, container);
                document.body.removeChild(container);
                clearTimeout(t);
            }, 200);
        }
    };
    if (opt.duration) {
        // 如果传入的值为0可以持续保留在页面，需要手动销毁
        const timer = setTimeout(() => {
            destory();
            clearTimeout(timer);
        }, opt.duration);
    }
    return {
        destory,
    };
};
export default Toast;
